<!doctype html>
<html class="no-js" lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Foundation | Welcome</title>
        <link rel="stylesheet" href="css/foundation.css" />
        <link rel="stylesheet" href="style.css" />
        <script src="js/vendor/modernizr.js"></script>
    </head>
    <body>
        <!-- Header and Nav -->
        <div class="grid-container">
            <div class="grid-x">
                <div class="large-12 cell">
                    <div class="panel">
                        <h1>Feed Template</h1>
                    </div>
                </div>
            </div>
        </div>
        <div class="grid-container">
            <div class="grid-x grid-padding-x">
                <div class="large-3 cell">
                    <div class="panel">
                        <a href="#">
                            <img src="http://placehold.it/300x240&text=[img]" />
                        </a>
                        <h5><a href="#">Your Name</a></h5>
                        <div class="section-container">
                            <section class="section">
                                <h5 class="title"><a href="#">Section 1</a></h5>
                            </section>
                            <section class="section">
                                <h5 class="title"><a href="#">Section 2</a></h5>
                            </section>
                            <section class="section">
                                <h5 class="title"><a href="#">Section 3</a></h5>
                            </section>
                            <section class="section">
                                <h5 class="title"><a href="#">Section 4</a></h5>
                            </section>
                            <section class="section">
                                <h5 class="title"><a href="#">Section 5</a></h5>
                            </section>
                            <section class="section">
                                <h5 class="title"><a href="#">Section 6</a></h5>
                            </section>
                        </div>
                    </div>
                </div>
                <div class="large-6 cell">
                    <div class="media-object">
                        <div class="media-object-section">
                            <div class="thumbnail">
                                <img src="http://placehold.it/80x80&text=[img]" />
                            </div>
                        </div>
                        <div class="media-object-section">
                            <p><strong>Some Person said:</strong> Bacon ipsum dolor sit amet nulla ham qui sint exercitation eiusmod commodo, chuck duis velit. Aute in reprehenderit, dolore aliqua non est magna in labore pig pork biltong.</p>
                            <ul class="menu">
                                <li>
                                    <a href="">Reply</a>
                                </li>
                                <li>
                                    <a href="">Share</a>
                                </li>
                            </ul>
                            <h6>2 Comments</h6>
                            <div class="media-object">
                                <div class="media-object-section">
                                    <div class="thumbnail">
                                        <img src="http://placehold.it/50x50&text=[img]" />
                                    </div>
                                </div>
                                <div class="media-object-section">
                                    <p>Bacon ipsum dolor sit amet nulla ham qui sint exercitation eiusmod commodo, chuck duis velit. Aute in reprehenderit</p>
                                </div>
                            </div>
                            <div class="media-object">
                                <div class="media-object-section">
                                    <div class="thumbnail">
                                        <img src="http://placehold.it/50x50&text=[img]" />
                                    </div>
                                </div>
                                <div class="media-object-section">
                                    <p>Bacon ipsum dolor sit amet nulla ham qui sint exercitation eiusmod commodo, chuck duis velit. Aute in reprehenderit</p>
                                </div>
                            </div>
                        </div>
                    </div>
                    <hr />
                    <div class="media-object">
                        <div class="media-object-section">
                            <div class="thumbnail">
                                <img src="http://placehold.it/80x80&text=[img]" />
                            </div>
                        </div>
                        <div class="media-object-section">
                            <p><strong>Some Person said:</strong> Bacon ipsum dolor sit amet nulla ham qui sint exercitation eiusmod commodo, chuck duis velit. Aute in reprehenderit, dolore aliqua non est magna in labore pig pork biltong.</p>
                            <ul class="inline-list menu">
                                <li>
                                    <a href="">Reply</a>
                                </li>
                                <li>
                                    <a href="">Share</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <!-- Feed Entry -->
                    <!-- End Feed Entry -->
                    <hr />
                    <div class="media-object">
                        <div class="media-object-section">
                            <div class="thumbnail">
                                <img src="http://placehold.it/80x80&text=[img]" />
                            </div>
                        </div>
                        <div class="media-object-section">
                            <p><strong>Some Person said:</strong> Bacon ipsum dolor sit amet nulla ham qui sint exercitation eiusmod commodo, chuck duis velit. Aute in reprehenderit, dolore aliqua non est magna in labore pig pork biltong.</p>
                            <ul class="inline-list menu">
                                <li>
                                    <a href="">Reply</a>
                                </li>
                                <li>
                                    <a href="">Share</a>
                                </li>
                            </ul>
                            <h6>1 Comment</h6>
                            <div class="media-object">
                                <div class="media-object-section">
                                    <div class="thumbnail">
                                        <img src="http://placehold.it/50x50&text=[img]" />
                                    </div>
                                </div>
                                <div class="media-object-section">
                                    <p>Bacon ipsum dolor sit amet nulla ham qui sint exercitation eiusmod commodo, chuck duis velit. Aute in reprehenderit</p>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- Feed Entry -->
                    <!-- End Feed Entry -->
                    <!-- Feed Entry -->
                    <!-- End Feed Entry -->
                </div>
                <aside class="large-3 cell hide-for-small">
                    <p><img src="http://placehold.it/300x440&text=[ad]" /></p>
                    <p><img src="http://placehold.it/300x440&text=[ad]" /></p>
                </aside>
            </div>
        </div>
        <!-- End Header and Nav -->
        <!-- Footer -->
        <footer class="grid-container">
            <div class="grid-x">
                <div class="large-12 cell">
                    <hr />
                    <div class="grid-x">
                        <div class="large-5 cell">
                            <p>© Copyright no one at all. Go to town.</p>
                        </div>
                        <div class="large-7 cell">
                            <ul class="float-right menu">
                                <li>
                                    <a href="#">Section 1</a>
                                </li>
                                <li>
                                    <a href="#">Section 2</a>
                                </li>
                                <li>
                                    <a href="#">Section 3</a>
                                </li>
                                <li>
                                    <a href="#">Section 4</a>
                                </li>
                                <li>
                                    <a href="#">Section 5</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </footer>
        <script src="js/vendor/jquery.js"></script>
        <script src="js/foundation.min.js"></script>
        <script>
          $(document).foundation();
        </script>
    </body>
</html>
